<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
<head>
    <title>文件管理</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link th:href="@{/css/dashboard.css}" rel="stylesheet">

    <link th:href="@{/css/fileinput.css}" media="all" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" crossorigin="anonymous">
    <link th:href="@{themes/explorer-fas/theme.css}" media="all" rel="stylesheet" type="text/css"/>
</head>
<body>
<div th:replace="~{commons/commons::topbar}"></div>

<div class="container-fluid">
    <div class="row">
        <div th:insert="~{commons/commons::sidebar(active=MyFileList)}"></div>
        <main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">


            <div class="table-responsive">
                <table class="table table-striped table-sm">
                    <thead>
                    <tr>
                        <th>文件编号</th>
                        <th>文件名</th>
                        <th>上级文件夹</th>
                        <th>上传者</th>
                        <th>上传时间</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr th:each="file:${myfiles}">
                        <td th:text="${file.getFid()}"></td>
                        <!--                                    <td th:text="${file.getFileName()}"></td>-->
                        <td><a class="btn" th:href="@{'/download?'+'file='+${file.getFid()}}" onclick="DownloadScan()">[[${file.getFileName()}]]</a></td>
                        <td th:text="${file.getFolderId()}"></td>
                        <td th:text="${file.getUserId()}"></td>
                        <!--file.department.getDepartmentNam 1e()-->
                        <!--                                    <td th:text="${file.department.getDepartmentName()}"/>-->
                        <td th:text="${#dates.format(file.getUploadTime(),'yyyy-MM-dd HH:mm:ss')}"></td>
                        <td>
                            <button class="btn btn-sm btn-primary" data-toggle="modal" data-target="#rename" th:onclick="Values([[${file.getFid()}]],[[${file.getFileName()}]])">重命名</button>
                            <button class="btn btn-sm btn-danger" th:onclick="del('delete?Fid=[[${file.getFid()}]]')" >删除</button>

                        </td>

                    </tr>
                    </tbody>
                </table>
            </div>
        </main>


    </div>
</div>
<script type="text/javascript" th:src="@{/js/popper.min.js}"></script>
<script type="text/javascript" th:src="@{/js/jquery-3.2.1.slim.min.js}"></script>
<!--    <script type="text/javascript" th:src="@{/js/bootstrap.min.js}"></script>-->
<!--<script src="http://lib.sinaapp.com/js/jquery/3.1.0/jquery-3.1.0.min.js" crossorigin="anonymous"></script>-->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
<script th:src="@{/js/plugins/piexif.js}" type="text/javascript"></script>
<script th:src="@{/js/plugins/sortable.js}" type="text/javascript"></script>
<script th:src="@{/js/fileinput.js}" type="text/javascript"></script>
<script th:src="@{/js/locales/zh.js}" type="text/javascript"></script>
<script th:src="@{/themes/fas/theme.js}" type="text/javascript"></script>
<script th:src="@{/themes/explorer-fas/theme.js}" type="text/javascript"></script>

<script>
    $('#file-zh').fileinput({
        theme: 'fas',
        language: 'zh',
        uploadUrl: '/upload?folder='+GetQueryString("folder"),
        // previewSettings: {
        //     other: {width: "50px", height: "50px"},
        // }

    }).on("fileuploaded",function (event,data,msg) {
        alert(event.handleObj.handler.arguments[1].response.msg);
        location.reload();
    });
    function Values(ID,name) {
        $("#id").val(ID);
        $("#name").val(name);
    }
    function GetQueryString(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]); return 0;}
    function del(url) {
        var request = new XMLHttpRequest();
        request.open("POST", '/' + url);
        request.send();
        request.onreadystatechange = function () {
            if (request.readyState == 4 && request.status == 200) alert(request.responseText);
            location.reload();
        }
    }
</script>
<div class="modal fade" id="rename" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel">修改文件信息</h4>
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            </div>
            <div class="modal-body">
                <form role="form" class="form-group" th:action="@{/rename}" method="post">
                    <label class="col-sm-2 control-label">重命名</label>
                    <input type="hidden" name="Fid" id="id">
                    <input type="text" class="form-control" name="filename" id="name">
                    <label>移动至</label>
                    <select class="form-control" name="folder">
                        <option value=-1 th:text="不更改文件夹"></option>
                        <option value=0 th:text="根目录"></option>
                        <option th:each="folder:${folders}" th:value="${folder.getId()}" th:text="${folder.getFolderName()}"></option>
                    </select>
                    <button type="submit" class="btn btn-default">提交</button>
                </form>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

</body>
</html>